import * as THREE from "three";
import { OrbitControls } from "three/examples/jsm/controls/OrbitControls";
import { OBJLoader } from 'three/examples/jsm/loaders/OBJLoader'

var w = window.innerWidth, h = window.innerHeight
var camera, scene, renderer, mesh
let gw = 50, gh = 50
function init() {
  scene = new THREE.Scene()

  camera = new THREE.PerspectiveCamera(45, w / h, 1, 10000)
  camera.position.set(50, 80, 100)
  camera.up.y = 1
  camera.lookAt(scene.position)

  renderer = new THREE.WebGLRenderer()
  renderer.setClearColor(0x3f5e6a)
  renderer.setSize(w, h)

  document.body.appendChild(renderer.domElement)

  // createGeometry()

  let points = []
  let colors = []
  for (let x = 0; x < gw; x++) {
    for (let y = 0; y < gh; y++) {

      points.push(
        x, y, 0,
        x + 1, y, 0,
        x, y + 1, 0,

        x, y + 1, 0,
        x + 1, y + 1, 0,
        x + 1, y, 0
      )

      if(x%2===0){
        colors.push(
          1,0,0,
          1,0,0,
          1,0,0,
          1,0,0,
          1,0,0,
          1,0,0,
        )
      }else{
        colors.push(
          0.2,0.2,0.2,
          0.2,0.2,0.2,
          0.2,0.2,0.2,
          0.2,0.2,0.2,
          0.2,0.2,0.2,
          0.2,0.2,0.2,
        
        )
      }
  
    }

  }
  console.log('====', colors);

  var geometry = new THREE.BufferGeometry()
  geometry.setAttribute('position', new THREE.BufferAttribute(new Float32Array(points), 3))
  geometry.setAttribute('color', new THREE.BufferAttribute(new Float32Array(colors), 3))
  var material = new THREE.MeshBasicMaterial({  side: THREE.DoubleSide,vertexColors:THREE.VertexColors })

  mesh = new THREE.Mesh(geometry, material)
  scene.add(mesh)

  var grid = new THREE.GridHelper(200,20)
  grid.add(mesh)
  scene.add(grid)

  // var light = new THREE.AmbientLight(0xffff00, 0.7, 1000, 1)
  // light.position.set(0, 0, 800)
  // scene.add(light)

}
function createGeometry() {

}
function animate() {
  renderer.render(scene, camera)
}

init()
animate()
// /** --------------------鼠标控件对象--------------------- */
let controls = new OrbitControls(camera, renderer.domElement); //创建控件对象
controls.addEventListener("change", animate); //监听鼠标、键盘事件
